<!DOCTYPE HTML PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN"　"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1">
<title>智慧城市管理平台</title>
<!-- <link Rel="SHORTCUT ICON" href="/pc/login/img/logo1.png"> -->
<script src="/pc/login/js/jquery.min.js" type="text/javascript"></script>
<script src="/pc/login/js/jquery.slider.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="/pc/login/css/normalize.css" />
<link rel="stylesheet" type="text/css" href="/pc/login/css/demo.css" />
<!--必要样式-->
<link rel="stylesheet" type="text/css" href="/pc/login/css/component.css" />
<link rel="stylesheet" href="/pc/login/css/index.css">
<link href="/pc/login/css/jquery.slider.css" rel="stylesheet" type="text/css"/>
<style>
input, button, select, textarea {
outline: none;
border: 0;
}

input:hover{
    background-color:rgba(255,255,255,0.8) !important ;
    color: #8B8B78;
}
#pn11,select,li:hover{
   cursor:pointer; 
}

button,input{
  border-radius: .7rem;
  height: 3em;
  -webkit-transition: all 300ms ease;
  transition: all 500ms ease;
  width: 25rem;
  color: white;
  outline: none;
}
button{
   border: 0 !important;
}
.hide{
  display: none;
}
.ys{
  color:#B0B0B0;
}

</style>
</head>
<body>
    <div class="container demo-1">
      <div class="z1">
        <div id="large-header" class="large-header">
          <canvas id="demo-canvas"></canvas>
         <div class="logo_box" id="dv2">           
           <div class="z2">
             <h3 style="font-weight: bold;font-size: 2.5em;position: absolute;bottom: 11.5em;right: 1.4em;">智慧城市管理平台</h3>
             <ul  id="qh" style="overflow: hidden;margin-bottom: 1em;margin-right: 3em">
              <li  id="zc2" class="ys reset1" style="width: 33.3%;float: left; text-align: center; font-size: 1.2em;">注册</li>
              <li  id="dl2"  style="width: 33.3%;float: left; text-align: center;font-size: 1.2em; ">登陆</li>
              <li  id="wj2" class="ys" style="width: 33.3%;text-align: center;float: left; font-size: 1.2em;">忘记密码</li>
            </ul> 
          </div>
       <div id="dq">
                   <!-- 注册表单 -->
          <form action="/admin/login/create"  method="POST" id="form1" onsubmit="return fn()" class="hide"  style="position: relative;"  >
              {{ csrf_field() }}
              <input type="text" id="inp1" placeholder=" 请输入账号"  name="account" style="height: 3em;background: rgba(255,255,255,0.08);  padding-right: 0.4em; border: 1px solid #707070;    font-size: 0.9em" />
              <p id="p1" style="position: absolute; left: 21.2em; top: 0.35em; width: 40em;   font-size: 0.9em;  color:#999;"></p>
              <input type="text" id="inp12" placeholder=" 请输入公司名称"  name="name" style="height: 3em;background: rgba(255,255,255,0.08);  padding-right: 0.4em; border: 1px solid #707070;    font-size: 0.9em" />
              <p id="p12" style="position: absolute; left: 21.2em; top: 4em; width: 40em;   font-size: 0.9em;color:#999;"></p>
           
                <input type="text" id="inp13" placeholder=" 请输入联系人"  name="linkman" style="height: 3em;background: rgba(255,255,255,0.08);  padding-right: 0.4em; border: 1px solid #707070;    font-size: 0.9em" />
              <p id="p13" style="position: absolute; left: 21.2em; top: 8em; width: 40em;   font-size: 0.9em;  color:#999;"></p>
              <input type="number" id="inp2" placeholder="请输入手机号" name="phone" style="height: 3em;background: rgba(255,255,255,0.08); padding-left: 1.05em;   border: 1px solid #707070;    font-size: 0.9em" />
              <p id="p2" style="  font-size: 0.9em;   position: absolute; top: 11.8em; left: 21.2em; width:25em;color:#999;;"></p> 

             <input type="password" id="inp3" placeholder=" 请输入密码" name="pwd" style="height: 3em;background: rgba(255,255,255,0.08);    border: 1px solid #707070;    font-size: 0.9em" />
              <p id="p3" style="font-size: 0.9em;position: absolute; top: 15.7em; left: 21.2em; width:40em;color:#999;"></p> 

               <input type="password" id="inp4" placeholder="确 认 密 码"  name="rpwd" style="height: 3em;background: rgba(255,255,255,0.08);    border: 1px solid #707070;font-size: 0.9em" />
              <p id="p4" style=" font-size: 0.9em;    position: absolute;top: 19.4em;left: 21.2em;width:25em;color:#999;"></p>

               <select  class="ui-field"  name="agent_id" id="xl" style="height: 3em;margin-top:0.4em;padding-left: 7.8em; background:rgba(255,255,255,0.08) !important; color: #B0B0B0;font-size: 0.9em">
                  <option id="opt1" selected value="">请选择代理商</option>
                @if($data)
                  @foreach ($data as $v )
                    <option  value="{{$v['id']}}">{{$v['name']}}</option>
                  @endforeach
                @else
                  <option  value="0">总代理</option>
                @endif
            </select>
            <p id="p5" style=" font-size: 0.9em;position: absolute;top: 23.2em;left: 21.2em;width:25em;color:#999;"></p>
            <!-- 滑动验证 -->
           <div id="slider1" class="slider" style=" background: rgba(255,255,255,0.08);  border-radius: .7em;  margin-top: 0.8em;width: 25rem;height: 3em;"></div>   
           <button  type="submit1" id="btn1" style="border: 1px solid #707070;    margin-top: 0.6em;width: 25rem;height: 64px;font-size: 1.2em;margin-top: .8em" >注册</button>
          </form>

          <!-- 登陆表单 -->
          <form action="/admin/login/logon" id="form2" method="POST" style="position: relative;"  onsubmit="return fn1()" >             
              {{ csrf_field() }}
              <input type="text" id="inp5" placeholder="请输入账号/手机号" value="" name="account" style="background: rgba(255,255,255,0.08); border: 1px solid #707070;" />
               <p id="p6" style="  font-size: 0.9em;   position: absolute; top: 0.5em; left: 21.2em; width:25em;color:#999;"></p>
              <input type="password" id="inp6" placeholder="请输入密码" name="pwd" style="background: rgba(255,255,255,0.08); border: 1px solid #707070;"/>
               <p id="p7" style=" font-size: 0.9em; position: absolute; top: 4.7em; left: 21.2em; width:40em;color:#999;"></p>
               <!-- 滑块 -->
              <div id="slider2" class="slider" style=" background: rgba(255,255,255,0.08);  border-radius: .7em; margin-top: 0.4em;width: 25rem;height: 3em;"></div>
              <button id="btn2" style="border: 1px solid #707070; width: 25rem; height: 64px; font-size: 1.2em;margin-top: .8em" >登陆</button>
               @if(session('msg'))
                 @if(session('msg')=='登录失败！')
                 <script type="text/javascript">      
                  $("#btn2").html("登陆失败！");
                  $("#inp5,#inp6").click(function(){
                     $("#btn2").html("登陆");
                  });        
                 </script>
                 @endif
               @endif
          </form>

          <!-- 忘记密码表单 -->
           <form action="/admin/login/forget" id="form3" method="POST"  style="position: relative;" class="hide" onsubmit="return fn2()">
            {{ csrf_field()}}
               <input type="number" id="inp7" placeholder="请输入手机号"  name="mobile" style="background: rgba(255,255,255,0.08);    border: 1px solid #707070;" />
                <p id="p8" style="  font-size: 0.9em;   position: absolute; top: 0.55em; left: 21.2em; width:25em;color:#999;"></p>  
               <input type="password" id="inp10" placeholder="验证码" name="code" style="background: rgba(255,255,255,0.08);  width: 12.5em;  border: 1px solid #707070;" />
               <input  id="pn11" type="button" style="   background: rgba(255,255,255,0.08); position: absolute; top: 3.8em; left: 12.8em; width:6em;height:3em;line-height: 3em; border: 1px solid #707070;border-radius: .7em;color: #707070 " value="获取验证码"/>
                <p id="p11" style="  font-size: 0.9em;   position: absolute; top: 4.6em; left: 21.2em; width:25em;color:#999;"></p>       
              <button  id="btn3" style="border: 1px solid #707070;width: 25rem;height: 64px;font-size: 1.2em;margin-top: .9em;" >重置密码</button>
           </form>
        </div>   
       </div>
      </div>
      </div>
    </div>
     <script src="/pc/login/js/TweenLite.min.js"></script>
    <script src="/pc/login/js/EasePack.min.js"></script>
    <script src="/pc/login/js/demo-1.js"></script>
    <script src="/pc/login/js/login.js"></script>

  </body> 
 <script>
  (function(w){if(!("WebSocket"in w&&2===w.WebSocket.CLOSING)){var d=document.createElement("div");d.className="browsehappy";d.innerHTML='<div style="width:100%;height:100px;font-size:20px;line-height:100px;text-align:center;background-color:#E90D24;color:#fff;margin-bottom:40px;">\u4f60\u7684\u6d4f\u89c8\u5668\u5b9e\u5728<strong>\u592a\u592a\u65e7\u4e86</strong>\uff0c\u592a\u592a\u65e7\u4e86 <a target="_blank" href="http://www.google.cn/chrome/browser/desktop/index.html" style="background-color:#31b0d5;border-color: #269abc;text-decoration: none;padding: 6px 12px;background-image: none;border: 1px solid transparent;border-radius: 4px;color:#FFEB3B;">\u7acb\u5373\u5347\u7ea7</a></div>';var f=function(){var s=document.getElementsByTagName("body")[0];if("undefined"==typeof(s)){setTimeout(f,10)}else{s.insertBefore(d,s.firstChild)}};f()}}(window));
     // 选项卡切换页面
     msgcode = '';
      $(function(){
      $('#qh li').click(function(){
        $(this).removeClass("ys ").siblings().addClass("ys");
        var index=$(this).index(); //获取被按下按钮的索引值
        $("#dq form").eq(index).show(1000).siblings().hide(1000);
      });
      $("#slider1").slider({
    callback: function(result) {
      $("#result1").text(result);
    }
  });
  $("#slider2").slider({
    callback: function(result) {
      $("#result1").text(result);
    }
  });
  $("#slider3").slider({
    callback: function(result) {
      $("#result1").text(result);
    }
  });
 
  // 点击注册表单移除表单之前已经选过的样式
  $("#zc2").click(function(){
    $("#inp1,#inp2,#inp3,#inp4,#inp12，#inp13").val("");
    $("#p1,#p2,#p3,#p4,#p5,#p12,#p13").text("");
    $("#xl").find("option").eq(0).prop("selected",true)
    $("#slider1").slider("restore");
  });

  // 点击登录表单移除表单之前已经选过的样式
  $("#dl2").click(function(){ 
    $("#inp5,#inp6").val("");
    $("#p6,#p7").text("");
    $("#slider2").slider("restore");
  });
    
  // 点击忘记表单移除表单之前已经选过的样式
  $("#wj2").click(function(){
    $("#inp7,#inp10").val("");
    $("#p8,#p11").text("");
  });
});

</script>
</html>


